{% load static %}

<nav class="navbar-default navbar-static-side" role="navigation">
  <div class="sidebar-collapse">
    <ul class="nav metismenu" id="side-menu">
      <li class="nav-header">
        <div class="dropdown profile-element">
          <img alt="image" class="rounded-circle" src="{% static 'oracle/images/default/a_supergirl.jpg' %}"
               width="60px"/>
          <a data-toggle="dropdown" class="dropdown-toggle" href="#">
            <span class="block m-t-xs font-bold">David Williams</span>
            <span class="text-muted text-xs block">Art Director <b class="caret"></b></span>
          </a>
          <ul class="dropdown-menu animated fadeInRight m-t-xs">
            <li><a class="dropdown-item" href="profile.html">Profile</a></li>
            <li><a class="dropdown-item" href="contacts.html">Contacts</a></li>
            <li><a class="dropdown-item" href="mailbox.html">Mailbox</a></li>
            {% if data.logout_url %}
              <li class="dropdown-divider"></li>
              <li><a class="dropdown-item" href="{% url data.logout_url %}">Logout</a></li>
            {% endif %}
          </ul>
        </div>
        <div class="logo-element">
          TW+
        </div>
      </li>

      {{ data.nav|safe }}
    </ul>
  </div>
</nav>